<template>
	<view class="page">
		<u-navbar
			leftIconSize="32rpx" 
			:placeholder="true" 
			:fixed="true" 
			:safeAreaInsetTop="true" 
			:autoBack="true"
			:border-bottom="false"></u-navbar>
		<view style="text-align: center;margin-bottom: 30rpx;">
			<image style="width: 200rpx;height: 200upx;margin-top: 20rpx;border-radius:20rpx" :src="logo">
			</image>
			<view style="font-size: 38rpx;margin-top: 20rpx;  font-weight: bold;">{{name}}</view>
		</view>
		<view style="background-color: #fff; padding: 40rpx 60rpx; margin: 20rpx;border-radius: 20rpx;">
			<u--form labelWidth="0" :borderBottom="true" :model="form" ref="uForm" labelAlign='left' :error-type="errorType">
				<u-form-item :borderBottom="true" prop="mobile">
					<u--input border="none" v-model="form.mobile" placeholder="请输入手机号" />
				</u-form-item>
				<view style="height: 40rpx;"></view>
				<u-form-item  :borderBottom="true" prop="password">
					<u--input border="none" v-model="form.password" type="password" placeholder="请输入密码" />
				</u-form-item>
			</u--form>
			<view style="margin-top: 90rpx;">
				<u-button
					@click="submit" 
					shape="circle" 
					color="linear-gradient(to left, #DA251B, #E0190E)"
					text="确认登录">
				</u-button>
			</view>
			

			<view class="footer">
				<text>登录即代表同意</text>
				<!-- 协议地址 -->
				<navigator url="/pages/auth/mimi" open-type="navigate" style="color: #E0190E;">《隐私政策》</navigator>
				和
				<navigator url="/pages/auth/xieyi" open-type="navigate" style="color: #E0190E;">《用户服务协议》</navigator>
			</view>
		</view>
		<view style="position: absolute;bottom: 80rpx;width: 100%;">
			<view class="unlogin">
				<view style="color: #E0190E;" @click="openPage('/pages/auth/findPassword')">忘记密码</view>
				<view style="color: #E0190E;" @click="openPage('/pages/auth/register')">注册</view>
			</view>
		</view>
	</view>
</template>
<script>
	import imagesUrl from '../../common/images.js'
	import {mobileLogin} from '../../common/auth.api.js'
	import {getui} from '../../common/tool.api.js'
	
	export default {
		data() {
			return {
				codeTips: '获取验证码',
				name: getApp().globalData.APP_NAME,
				logo: getApp().globalData.APP_LOGO,
				form: {
					mobile: '',
					password: '',
				},
				rules: {
					mobile: [{
						required: true,
						message: '请输入手机号码',
						// 可以单个或者同时写两个触发验证方式 
						trigger: ['blur'],
					}],
					password: [{
						min: 6,
						message: '密码不能少于6个字',
						trigger: 'blur'
					}, {
						required: true,
						message: '请填写密码',
						trigger: ['blur']
					}]
				},
				errorType: 'message',
				leftIconStyle: {
					width: '40rpx',
					height: '40rpx',
					'margin-top': '24rpx'
				},
				seconds: 60,
				images: [],
			}
		},
		onReady() {
			this.$refs.uForm.setRules(this.rules);
		},
		onLoad() {
			uni.setStorageSync('token', null)
			uni.setStorageSync('pageNum', 2);

			this.images = imagesUrl
			
			console.log()
			// console.log('cid111111', uni.getSystemInfoSync().platform)
		},
		methods: {
			openPage(path, params = {}) {
				this.$u.route({
					url: path,
					params
				})
			},

			submit() {
				let __this = this;

				// this.$refs.uForm.validate().then(valid => {
						uni.showLoading({
							title: '正在登录'
						})
						
						mobileLogin({
							...__this.form
						}).then(res => {
							// vm.$store.setState('')
							uni.setStorageSync('token', res.token)
							uni.hideLoading()
							uni.$emit('updateUserInfo', {
								msg: '刷新用户信息'
							})
							
							// #ifdef APP-PLUS
							let pinf = plus.push.getClientInfo();
							let cid = pinf && pinf.clientid || ''; //客户端标识
							plus.push.getClientInfoAsync((info) => {
								cid = info.clientid;
								console.log('cid', cid)
								console.log('system', uni.getSystemInfoSync().platform)
								getui({
									client_id: cid,
									system: uni.getSystemInfoSync().platform,
									token: res.token
								}).then(res1 => {})
							}, err => {});
							// #endif
							
							
							__this.$u.toast('登录成功');
							uni.$u.route({
								type: 'switchTab',
								url: 'pages/index/index',
							})
						})
				// }).catch(errors => {
				// 	console.log(errors)
				// })
			}
		}
	}
</script>


<style lang="scss">
	@import "../../static/iconfont.css";

	.page {
		background-color: #fff;
		min-height: 100Vh;
		width: 100vw;
	}

	.footer {
		margin-top: 32upx;
		font-size: 24upx;
		color: #666666;
		text-align: center;
		display: flex;
		justify-content: center;
	}

	.unlogin {
		display: flex;
		justify-content: space-around;
		align-items: center;
		margin-top: 30rpx;
		color: #999;
		font-size: 28rpx;
	}

	// .leftIconStyle {
	// 	width: 30rpx;
	// 	height: 30rpx;
	// 	align-items: center;
	// }
</style>
